/*结构
<div class="m-grade-stars">
  <div class="m-grade_star">
    <span class="m-grade_star_score">1.4</span>
    <div class="m-grade_star_bg">
        <div class="m-grade_star_num" style="width: 25.2px;"></div>
    </div>
  </div>
</div>
.m-grade-stars>.m-grade_star>span.m-grade_star_score{1.4}+(.m-grade_star_bg>.m-grade_star_num[style=width:25.2px;])
.m-grade-stars--red
*/
$start_up:url("../images/icon-global/evaluate-starts.png");
$start_down:none;
$start_color:#FF6600;
$bg_height:20px;
$bg_width:146px;
.m-grade-stars{
  display:inline-block;
  height:22px;
}
.m-grade_num{
  display:inline-block;
  line-height: 26px;
  margin-top:2px;
  vertical-align: middle;
  font-size:14px;
  color:$start_color;
}
.m-grade_star{
  color:$start_color;
  font-size:14px;
  height:26px;
  line-height:26px;
  width:auto;
  display:inline-block;
}
.m-grade_star_score{
  display:inline-block;
  vertical-align: middle;
  line-height: $bg_height;
  font-size:16px;
  margin-top:2px;
  margin-right:5px;
}
.m-grade_star_bg{
  display:inline-block;
  vertical-align: middle;
  height:$bg_height;
  position: relative;
  width:$bg_width;
  z-index:10;
  background-image:$start_down;
}
.m-grade_star_num{
  background-image:$start_up;
  background-position:0 -20px;
  display:inline-block;
  height:$bg_height;
  left:0;
  position:absolute;
  top:0;
  width:90px;
  z-index:11;
}
.m-grade-stars--red .m-grade_star_bg,
.m-grade-stars--red .m-grade_star_num{
  background-image:$start_down;
}